// Created by liusc on 2020/8/5-9:24.
<template>
  <div class="budgetWrap">
    <div class="resource-manage">
      <div class="card-box">
        <div class="card-title">
          <span>申请信息</span>
        </div>
        <el-form ref="add-form" :model="form" :rules="rules" label-width="auto" class="form-wrap">
          <el-row>
            <el-col :span="8">
              <el-form-item label="预算编号" prop="budgetCode">
                <el-col class="in_txt">{{form.applyData.budgetCode}}</el-col>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item label="申请名称" prop="applyName">
                <el-col class="in_txt">{{form.applyData.applyName}}</el-col>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="申请部门">
                <el-col class="in_txt">{{applyDept2}}</el-col>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item label="申请类型">
                <el-col class="in_txt">{{applyType2}}</el-col>
              </el-form-item>
            </el-col>
          </el-row>

          <!-- <el-form-item label="预算编号"
                        prop="budgetCode">
            <el-col class="in_txt">{{form.applyData.budgetCode}}</el-col>
          </el-form-item>

          <el-form-item label="申请名称"
                        prop="applyName">
            <el-col class="in_txt">{{form.applyData.applyName}}</el-col>
          </el-form-item>

          <el-form-item label="申请部门">
            <el-col class="in_txt">{{applyDept2}}</el-col>
          </el-form-item>

          <el-form-item label="申请类型">
            <el-col class="in_txt">{{applyType2}}</el-col>
          </el-form-item>-->

          <div class="card-title">
            <span>预算调整</span>
          </div>

          <el-table
            :data="form.itemValueList"
            class="dubgetTable mt20"
            row-key="itemId"
            default-expand-all
            :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
          >
            <el-table-column class="weight" header-align="center" prop="itemName" label="科目" width="300">
              <template slot-scope="scope">
                <span style="margin-left: 10px">{{ scope.row.itemName }}</span>
                <el-switch v-model="scope.row.isNead" v-if="scope.row.children == null" :width="28" active-value="1" inactive-value="0" />
              </template>
            </el-table-column>
            <el-table-column align="center" label="原金额(元)">
              <el-table-column align="center" prop="itemValue" :label="`${form.applyData.budgetSum}`" />
            </el-table-column>
            <el-table-column align="center" label="调整后金额(元)">
              <el-table-column align="center" prop="itemValuePre" :label="`${form.applyData.budgetSum2 || '暂无数据'}`">
                <template slot-scope="scope">
                  <el-input clearable maxlength="15" @input="budgetChange()" :readonly="scope.row.children !== null" v-model="scope.row.itemValuePre" />
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column align="center" label="变化金额(元)">
              <el-table-column align="center" prop="itemValue" :label="`${form.applyData.changeAmount || '暂无数据'}`">
                <template slot-scope="scope">{{`${scope.row.changeAmount>0 ? '+':''}${scope.row.changeAmount || 0}`}}</template>
              </el-table-column>
            </el-table-column>
          </el-table>

          <!-- <el-table 
                    :data="form.itemValueList"
                    align="center">

            <el-table-column label="科目名称"
                             prop="itemName">
              <template slot-scope="scope">
                <el-input v-model="scope.row.itemName"
                          readonly="readonly"></el-input>
              </template>
            </el-table-column>

            <el-table-column label="原金额"
                             prop="itemValue">
              <template slot-scope="scope">
                <el-input v-model="scope.row.itemValue"
                          readonly="readonly"></el-input>
              </template>
            </el-table-column>

            <el-table-column label="调整后金额"
                             prop="itemValuePre">
              <template slot-scope="scope">
                <el-input v-model="scope.row.itemValuePre"></el-input>
              </template>
            </el-table-column>

            <el-table-column label="变化金额"
                             prop="changeAmount">
              <template slot-scope="scope">
                <el-input v-model="scope.row.changeAmount"></el-input>
              </template>
            </el-table-column>
          </el-table>-->

          <el-form-item label="备注" prop="applyData.remarks">
            <el-input v-model="form.applyData.remarks" placeholder="请输入备注" />
          </el-form-item>
        </el-form>
      </div>
    </div>

    <div class="resource-manage">
      <div class="card-box">
        <div class="card-title">文件上传</div>
        <div style="padding: 20px 20px">
          <upload-media
            type="file"
            ref="myApply"
            :url="fileUploadUrl"
            @onSuccess="onSuccess"
            @onError="onError"
            @beforeUpload="beforeUpload"
            @handleClean="handleClean"
            :propsFileList="uploadFileList"
            :isShowFileList="true"
            :loadFileList="fileList"
            :isView="false"
          ></upload-media>

          <!--                    <div class="mark mb20">-->
          <!--                        <div class="flex-c" v-for="(item, index) in files" :key="index">-->
          <!--                            <div class="name mr20">{{ item.original + '(' + (item.fileSize / 1024 / 1024).toFixed(4) + 'M)'}}</div>-->
          <!--                            <div class="date mr20">{{ item.updateTime }}</div>-->
          <!--                            <div class="btn">-->
          <!--                                <el-button type="text" @click="handleClean(item.fileId)">删除</el-button>-->
          <!--                            </div>-->
          <!--                        </div>-->
          <!--                    </div>-->
          <upload-media type="file" ref="myApply2" :busId="busId2" :modelType="modelType" :isShowFileList="true" :isView="true"></upload-media>
        </div>
      </div>
    </div>

    <div slot="footer" class="footer" style="padding-right: 0px">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" v-throttle="[commit]">保 存</el-button>
    </div>
  </div>
</template>

<script src="./amendapply_add.js"></script>
<style scoped lang="scss">
@import "./amendapply_add";
</style>

